﻿@using System.Text
@using Ganss.XSS
@using WebGrease.Css.Extensions
@{
    ViewBag.Title = "编辑文章";
    var article = ViewBag.article as HynuIOTA.Entity.BlogArticle;

    var sanitizer = new HtmlSanitizer();

    string tags = string.Empty;
    if (article.Tags.Any())
    {
        StringBuilder tagslsSbBuilder = new StringBuilder();
        article.Tags.ForEach(a => tagslsSbBuilder.Append($"{a.Id},"));
        tags = tagslsSbBuilder.ToString().Substring(0, tagslsSbBuilder.Length - 1);
    }
}
@section scripts
{
    <script src="~/kindeditor/kindeditor-all-min.js"></script>
    <script src="~/kindeditor/lang/zh-CN.js"></script>
    <script>
        function doBegin() {
            window.top.$.msgBoxObj.showMsgInfo('正在提交数据....');
        }

        function doFail() {
            window.top.$.msgBoxObj.showMsgErr('网络异常!');
        }

        function doComplete(xhrObj) {
            $.processJsonMsg(xhrObj.responseText,
                function(response) {
                    if (response.Statu === 1) {
                        window.top.topHelper.closeComWindow();
                        window.top.topHelper.updateDataGrid();
                    }
                });
        }

        // 初始化控件
        function initControl() {
            $('#tags').tagbox({
                hasDownArrow: true,
                limitToList: true,
                valueField: 'id',
                textField: 'text',
                url: '@Url.Content("~/Blogs/Blog/GetTagsCombox")',
                loadFilter: function(data) {
                    return data.Data;
                }
            });
            $('#addTag').dialog({
                title: '添加新标签',
                iconCls: 'icon-add',
                shadow: true,
                buttons: [
                    {
                        text: '添加',
                        iconCls: 'icon-ok',
                        handler: function() {
                            ajaxAddTag();
                        }
                    }, {
                        text: '取消',
                        handler: function() {
                            $('#addTag').dialog('close');
                        }
                    }
                ]
            }).dialog('close');
        }

        function ajaxAddTag() {
            $.notifyBox.showNotifyInfo('正在添加标签...');
            $.ajax({
                url: '@Url.Content("~/Blogs/Blog/AddTag")',
                type: 'POST',
                data: { TagName: $('#add-tag').val() },
                error: function() {
                    $.notifyBox.showNotifyErr('网络错误!');
                },
                success: function(response) {
                    $.processJsonMsgNotify(response,
                        function() {
                            if (response.Statu === 1) {
                                $('#tags').tagbox('reload');
                                $('#add-tag').textbox('setText', '');
                                $('#addTag').dialog('close');
                            }
                        });
                }
            });
        }

        $(function() {
            initControl();
            $('#btnAddTag').click(function() {
                $('#addTag').dialog('center').dialog('open');
                return false;
            });
        });
        //初始化编辑器
        KindEditor.ready(function(K) {
            var options = {
                cssPath: '@Url.Content("~/kindeditor/themes/qq/qq.css")',
                uploadJson: '@Url.Action("UploadFile", "File", new {area = "Media"})',
                fileManagerJson: '@Url.Action("FileManager", "File", new {area = "Media"})',
                resizeType: 1, // 只能改变高度
                allowFileManager: true,
                filterMode: true,
                afterBlur: function() { editor.sync(); },
                afterUpload: function(url, data, name) {
                    console.log(url);
                    console.log(data);
                    console.log(name);
                }
            };
            window.editor = K.create('#Content', options);
            // 弹出缩略图
            K('#form-upimg').click(function() {
                editor.loadPlugin('image',
                    function() {
                        editor.plugin.imageDialog({
                            imageUrl: $('#image').textbox('getValue'),
                            clickFn: function(url) {
                                $('#image').textbox('setValue', url);
                                editor.hideDialog();
                            }
                        });
                    });
                return false;
            });
        });
    </script>
}
@section headSection
{
    <style>
        #put-form {
            margin-top: 20px;
        }

            #put-form .input-div {
                margin: 15px;
                display: block;
            }
    </style>
}
<div>
    @using (Ajax.BeginForm("PutArticle", new { area = "Users", controller = "Manager" }, new AjaxOptions()
    {
        HttpMethod = "Put",
        OnBegin = "doBegin",
        OnFailure = "doFail",
        OnComplete = "doComplete"
    }, new { id = "put-form", name = "put-form" }))
    {
        <input type="hidden" name="Id" value="@article.Id" />
        <div class="input-div"><input id="Title" name="Title" value="@article.Title" class="easyui-textbox" data-options="label:'标题：',labelPosition:'left',labelWidth:100," style="width: 80%; height: 30px;"></div>
        <div class="input-div"><input id="Summary" name="Summary" value="@article.Summary" class="easyui-textbox" data-options="label:'摘要：',labelPosition:'left',labelWidth:100,multiline:true" style="width: 80%; height: 100px;"></div>
        <div class="input-div"><input id="image" name="image" value="@article.image" class="easyui-textbox" data-options="label:'缩略图(可空)：',labelPosition:'left',labelWidth:120," style="width: 80%; height: 30px;"><button type="button" id="form-upimg" style="margin-left:10px" class="badge color-grayish">上传图片</button></div>
        <div class="input-div"><input id="tags" name="tags" value="@tags" class="easyui-textbox" data-options="label:'标签：',labelPosition:'left',labelWidth:100," style="width: 55%; height: 30px;"><button type="button" id="btnAddTag" style="margin-left:10px" class="badge color-grayish">+</button></div>
        <div class="input-div"><input id="Content" value="@sanitizer.Sanitize(article.Content)" data-options="multiline:true" name="Content" style="width: 98%; height: 500px"></div>
        <div class="input-div">
            <input type="submit" class="easyui-linkbutton button-blue l-btn l-btn-small" name="submit" style="width: 46px; height: 30px; margin: 10px" value="提交" />
            <input type="reset" class="easyui-linkbutton button-red l-btn l-btn-small" style="width: 46px; height: 30px; margin: 10px" name="reset" value="重置" />
        </div>
    }
</div>
<div id="addTag" style="width:300px;height:150px; padding: 10px;display: none">
    <input type="text" id="add-tag" class="easyui-textbox" style="margin: 10px; width: 100%; height: 30px">
</div>